import React, { Component } from 'react'
import {HashRouter, Route, Link, Redirect} from 'react-router-dom'
import {
 Layout, Menu
} from 'antd'

const { SubMenu } = Menu
const { Header, Content, Footer } = Layout

import Home from '@/components/home'
import Movie from '@/components/movie'
import About from '@/components/about'
import appClass from '@/styles/app.less'

export default class app extends Component {
  render() {
    return (
      <HashRouter>
        <Layout style={ {height:'100%'} }>
          <Header className="header">
            <div className={appClass.logo}/>
            <Menu
              theme="dark"
              mode="horizontal"
              defaultSelectedKeys={[location.hash.split('/')[1] || 'home']}
              style={{ lineHeight: '64px' }}
            >
              <Menu.Item key="home"><Link to="/home" replace>首页</Link></Menu.Item>
              <Menu.Item key="movie"><Link to="/movie" replace>电影</Link></Menu.Item>
              <Menu.Item key="about"><Link to="/about" replace>关于</Link></Menu.Item>
            </Menu>
          </Header>
          <Layout style={{background:'#fff'}}>
            <Route exact path="/" render={()=><Redirect to="/home"/>} />
            <Route path="/home" component={Home}/>
            <Route path="/movie" component={Movie}/>
            <Route path="/about" component={About}/>
          </Layout>
          <Footer style={{ textAlign: 'center' }}>
            豆瓣电影 ©{new Date().getFullYear()} 饺子就酒
          </Footer>
        </Layout>
      </HashRouter>
    )
  }
}


